<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<title>首页
</title>
	<link rel="stylesheet" href="./Tpl/css/bootstrap.min.css">
  <script type="text/javascript" src='./Tpl/js/jquery.js'></script>
  
	<style type="text/css">
		.margin{
			margin-top: 80px;
   
		}


	</style>
</head>
<body>
	<div class="navbar navbar-inverse navbar-fixed-top">
    <div class="container">
        <div class="navbar-header">
            <button class="navbar-toggle collapsed" type="button" data-toggle="collapse"
            data-target=".navbar-collapse">
                <span class="sr-only">
                    Toggle navigation
                </span>
                <span class="icon-bar">
                </span>
                <span class="icon-bar">
                </span>
                <span class="icon-bar">
                </span>
            </button>
            <a class="navbar-brand hidden-sm" href="" onclick="_hmt.push(['_trackEvent', 'navbar', 'click', 'navbar-首页'])">
                聊天吧
            </a>
        </div>
      <div id="navbar" class="navbar-collapse collapse">
        <?php if(isset($_SESSION['username'])) { ?>
                <div class="navbar-form navbar-right">
                  <p  class="btn btn-danger"><?php echo $_SESSION['username'] ?></p>
                  <a href="./loginout.php" class="btn btn-success">退出</a>
                </div>
           <?php }else{ ?>
              <form action="./login.php" method="post" class="navbar-form navbar-right">
                <div class="form-group">
                  <input type="text" placeholder="用户名" class="form-control" name="username">
                </div>
                <div class="form-group">
                  <input type="password" placeholder="密码" name="password" class="form-control">
                </div>
                <button type="submit" class="btn btn-success">登录</button>
                <a href="./zhuce.php" class="btn btn-success">注册</a>
                
              </form>
          <?php  } ?>
              
      </div>
      <!-- <button type="submit" class="btn btn-success">注册</button>   -->
    </div>
</div>
	<div class="col-md-12 margin">
        <!-- foreach  循环数组 -->
		<?php foreach ($db as $k => $v) { ?>
			<div class="msgRow alert <?php echo $color[array_rand($color)] ?> " role="alert">
        <p>
    			 <strong>
			        <?php echo $v['username'] ?>
			    </strong>
			    <?php echo $v['content'] ?> (<?php echo date('Y/m/d H:i:s',$v['create_time']) ?>)
			    <button scid="<?php echo $k ?>" class="btn btn-danger delBtn"  role="button">删除</button>
			    <a class="btn btn-danger sditBtn" href="./edit.php?id=<?php echo $k ?>">修改</a>
        </p>
    	</div>
		<?php } ?>
    <div class="col-md-12">
        <nav aria-label="Page navigation">
         <ul class="pagination">

          <?php if($page<>1){ ?>
              <li>
                <a href="./index.php?p=<?php echo $page-1; ?>" aria-label="Previous">
                  <span aria-hidden="true">上一页</span>
                </a>
              </li>
          <?php } ?>          
          <?php for ($i=1; $i <=$pages ; $i++) { ?>   
            <li><a href="./index.php?p=<?php echo $i ?>"><?php echo $i ?></a></li>  
          <?php } ?>

          <?php if($page<>$pages){ ?>
              <li>
                <a href="./index.php?p=<?php echo $page+1; ?>" aria-label="Next">
                  <span aria-hidden="true">下一页</span>
                </a>
              </li>
          <?php } ?>
         </ul>
        </nav>
    </div>
		
	</div>
	<div class="col-md-12">
		<form method="post" action="./add.php">
    		<div class="form-group">
     		<label for="disabledTextInput">用户名</label>
      		<input type="text" id="disabledTextInput" class="form-control" name="username" placeholder="Disabled input">
    		</div>
    		<div class="form-group">
      		<label for="disabledSelect">留言区</label>
      		<textarea class="form-control content" name="content" rows="3"></textarea>
   			 </div>
    		<button type="submit" class="btn btn-primary">发送</button>
		</form>
	</div>
  <script type="text/javascript">
      $(function (){
          $('.delBtn').click(function(event) {
            var id = $(this).attr('scid');
            delBtn =$(this);          //定义全局变量，把点到那个的函数存在delBtn,来代替$(this).
            $.ajax({
              url: './ajaxDel.php',   //往哪里发
              type: 'post',             //以什么方式发
              dataType: 'json',         //返还数据的类型
              data: {msgid: id},   //前者'键'为post过去的name，后者'值'为要推过去的id。
            })
            .done(function(data) {     //成功怎样
              if(data.error==0){
                alert(data.info);
                delBtn.parents('.msgRow').remove();
                location.reload();    //刷新页面
              }
            })
            .fail(function(data) {      //失败怎样
              alert('失败');
            })
          });
      })



  </script>
</body>
</html>